import React, { Component } from 'react';
import style from './MailTemplate.less';
export default class MailTemplate extends Component {
  constructor(props) {
    super(props);
  }
  render() {
    let { children } = this.props;
    console.log(children);
    return (
      <div className={style.mailtemplate}>
        <header>
          <img src={require('../asset/logo.jpg')} alt="" />
          <h1>SOFA FING</h1>
        </header>
        <main>
          <div className={style.top}>
            <span className={style.left}>Time stamp dd-mmm-yyyy hh:mm</span>
            <span className={style.right}>Reference number</span>
          </div>
          <div className={style.title}>{children[0]}</div>
          <div className={style.content}>
            Dear XXX,
            {children[1]}
          </div>
          <div className={style.contactinfo}>{children[2]}</div>
          <div className={style.footer}>
            <p> Have questions? </p>
            <p>
              Contact our customer service hotline &nbsp; <img src={require('../asset/phone.jpg')} alt="" />{' '}
              1-972-876-3157
            </p>
            <p>
              {' '}
              Email our customer service agent <img src={require('../asset/email.jpg')} alt="" /> service@sofaking.com
            </p>
            {children[3]}
          </div>
        </main>
      </div>
    );
  }
}
